<template>
    <div>
        <div class="whiteBg business_branch">
            <ul>
                <li class="clearfix" v-for="item in businessBranch" @click="lookShop(item)">
                    <a>
                        <img :src="item.mchtLogUrl">
                        <div class="branch_cont">
                            <p class="branch_name">{{item.mchtName}}</p>
                            <div class="clearfix">
                                <star :couponComScore="item.mchtComScore"></star>
                                <span class="left">{{item.mchtComNum}}条</span>
                                <span class="right">¥{{item.mchtPer}}/人 <span>{{item.mchtTypeValue}}</span></span>
                            </div>
                        </div>
                    </a>
                </li>
            </ul>
        </div>

    </div>
</template>
<script>
    import star from '../../componentes/global/star.vue'
    import getData2 from '../../service/getData2.js'
    import * as types from '../../vuex/types.js'
    import * as types1 from '../../vuex/appendType'
    import {mapState} from 'vuex'

    export default {
        data() {
            return {
                businessBranch: []
            }
        },
        components: {
            star
        },
        computed: {

        },
        created: function () {
            var me = this;
            getData2.businessBranch({
                method: 'post',
                data: {"mchtId": me.$route.params.mchtId, "upperMchtId": me.$route.params.upperMchtId}
            }).then(function (rep) {
                me.businessBranch = rep.content.mchtBranchList
            })

        },
        methods: {

            lookShop: function (item) {
                this.$router.push({
                  name: 'merchDetail',
                  query: {mchtId: item.mchtId}
                });
            }
        },
    }
</script>
<style>
    .business_branch li {
        padding: 0.75rem 0.9375rem;
        border-bottom: 1px solid #f5f5f5;
    }

    .business_branch li a {
        display: block;
    }

    .business_branch li img {
        width: 3rem;
        height: 3rem;
        float: left;
    }

    .branch_cont {
        margin-left: 3.6rem;
    }

    .branch_name {
        font-size: 1rem;
        line-height: 1.7rem;
        height: 1.7rem;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .branch_cont span.left {
        color: #999;
        margin-left: 8px;
    }

    .branch_cont span.right {
        color: #ee3155;
    }

    .branch_cont span.right span {
        color: #666;
        margin-left: 12px;
    }
</style>
